<@override name="content">
<div class="header">
  <h1 class="page-title">在线列表</h1>
</div>
<ul class="breadcrumb">
  <li>
    <a href="admin">首页</a>
    <span class="divider">/</span>
  </li>
  <li class="active">用户管理</li>
</ul>
<div class="container-fluid">
  <div class="row-fluid">
    <div class="well">
      <div id="container">
        <div class="text-center">
          <h2>${userList?size} User(s) Online</h2>
          <span class="badge badge-info">${loginUserNum!0} logined and ${userList?size-loginUserNum} guests</span>
        </div>
        <table id="onlineuser" class="table table-striped table-condensed">
          <thead>
          <tr>
            <th>No.</th>
            <th>User</th>
            <th>Create Time</th>
            <th>Last Activity</th>
            <!-- <th>Expires Time</th> -->
            <th>IP</th>
            <th>User Agent</th>
            <th>URI</th>
          </tr>
          </thead>
          <tbody>
            <#if userList??>
              <#list userList as User>
              <tr>
                <td data-session-id="${User.sessionId!}">${User_index+1}</td>
                <td><#if User.name??><a href="user/profile/${User.name!}" class="user"
                                        data="${User.uid!}">${User.name}</a><#else>Guest</#if>
                </td>
                <td class="timestamp" data="${User.ctime!}"></td>
                <td class="timestamp" data="${User.lastActivity!}"></td>
                <!-- <td class="timestamp" data="${User.sessionExpires!}"></td> -->
                <td class="ip">${User.ipAddress!}</td>
                <td>${User.userAgent!}</td>
                <td class="uri"><a href="${baseUrl!}${User.uri!}" target="_blank">${User.uri!}</a></td>
              </tr>
              </#list>
            </#if>
          </tbody>
        </table>
        <!-- <div class="row-fluid">
          <button class="btn btn-info" id="expires">Expires</button>
        </div> -->
      </div>
    </div>
  </div>
</div>
</@override>

<@override name="scripts">
<link type='text/css' rel='stylesheet' href='assets/pnotify/jquery.pnotify.default.css' type="text/css">
<script src='assets/pnotify/jquery.pnotify.min.js' type='text/javascript'></script>
  <#if oj_style != "slate">
  <link rel="stylesheet" href="assets/tablecloth/css/tablecloth.css" type="text/css">
  <script src="assets/tablecloth/js/jquery.metadata.js"></script>
  <script src="assets/tablecloth/js/jquery.tablesorter.min.js"></script>
  <script src="assets/tablecloth/js/jquery.tablecloth.js"></script>
  </#if>

<script type="text/javascript">
  $(document).ready(function () {
    $('.timestamp').each(function () {
      $(this).html(getLocalTime($(this).attr('data')));
    });

    $('#expires').click(function () {
      $.post('/api/admin/expiresSession', function (data) {
        $.pnotify({
          title: 'Expires Session',
          text: data.expiresSession + ' sessions deleted!',
          history: false,
          type: data.expiresSession > 0 ? 'success' : 'info'
        });
        if (data.expiresSession > 0) {
          setTimeout(function () {
                    window.location.reload();
                  },
                  2000);
        }
      });
    });

    <#if oj_style != "slate">
      $("#onlineuser").tablecloth({
        theme: "stats",
        condensed: true,
        sortable: true,
        striped: true,
        clean: true
      });
    </#if>
  });
</script>
</@override>
<@extends name="../_layout.html" />
